@import "_common.scss";

  .header-wapper {
    position: relative;
    .header-search {
      position: absolute;
      z-index: 10;
      top: var(--status-bar-height); 
      width: 100%;
      .search {
        height: ws(34);
        margin: 0 ws(15);
        margin-top: ws(5);
        border-radius: ws(30);
        background-color: rgba(#fff, .6);
        display: flex;
        align-items: center;
        padding: 0 ws(15);
        font-size: ws(14);
        color: #6c6c6c;
        .mui-icon {
          color: #6c6c6c;
          font-size: ws(20);
          margin-right: ws(5);
        }
      }
    } 
  }
	
	.header-fiexd {
			position: fixed;
			top: 0;
			padding: 0 ws(15);
			width: 100%;
			display: flex;
			flex-direction: column;
			background-color: #fff;
			z-index: 1000;
			.header-wapper {
					height: ws(50);
					display: flex;
					color: #000;
					align-items: center;
					justify-content: space-between;
					.search {
						flex: 1;
						height: ws(34);
						border-radius: ws(30);
						background-color: #eee;
						display: flex;
						align-items: center;
						padding: 0 ws(15);
						font-size: ws(14);
						color: #6c6c6c;
						.mui-icon {
							color: #6c6c6c;
							font-size: ws(20);
							margin-right: ws(5);
						}
					}
			}
	}
	
	.content{
		height: 100%;
	}
	
  .module-list {
    margin: 0 ws(15);
    margin-top: ws(15);
    height: ws(110);
    background-color: #fff;
    border-radius: ws(7);
    display: flex;
    align-items: center;
    box-shadow: 0 ws(4) ws(10) 0 rgba($main-color, 0.15);
    > view {
      width: 25%;
    }
    .list-item {
      display: flex;
      flex-direction: column;
      align-items: center;
      margin-top: ws(10);
      .icon {
        width: ws(40);
        height: ws(40);
        background-image: linear-gradient(45deg, $main-color 0%, lighten($main-color, 20%) 100%);
        margin-bottom: ws(10);
        border-radius: ws(40);
				display: flex;
				align-items: center;
				justify-content: center;
				image{
					width: ws(25);
					height: ws(25);
				}
      }
      .title {
        font-size: ws(26/2);
        color: $main-color;
      }
    }
  }

  .mudule-class {
		margin-top: ws(30);
    .title-warpper {
      padding: 0 ws(20);
      display: flex;
      justify-content: space-between;
      align-items: center;
    }
    .list {
			padding: 0 ws(15);
			padding-bottom: ws(15); 
    }
  }


.zanwu-style{
	width: 100%;
	height: 100%;
	background-color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	> img {
		width: ws(100);
	}
}
